단위로 연결된 <number> 타입을 나타낸다. <length>, <angle>, <time>, <resolution>를 포함하는 상위 개념이다.
| 약식 표기 | 원래 표기 | 비고 |
|---|---|---|
| 15px | 15 pixels | |
| 1rem | 1 rem | |
| 1.5pt | 1.5 points | |
| 2000ms | 2000 milliseconds | |
| 3s | 3 seconds | |
| 100hz | 100 Hertz | |
| 100Hz | 100 Hertz | 약식 표기는 대소문자 구분하지 않음 |
| 예시 | 비고 |
|---|---|
| 15 px | 단위는 공백없이 작성해야 함 |
| 15"px" | 인용 부호를 사용하지 않음 |
| 3sec | 잘못된 초 단위 사용 |
| 단위 | 요약 |
|---|---|
| cm | 1cm(센티미터)는 96px를 2.54로 나눈 값을 나타낸다. |
| in | 1in(인치)는 2.54cm, 96px과 동일한 값을 나타낸다. |
| mm | 1cm의 1/10 값을 나타낸다. |
| pc | 1in의 1/16 값을 나타낸다. |
| pt | 1in의 1/72 값을 나타낸다. |
| px | 스크린의 기본 단위이다. 1in의 1/96 값을 나타낸다. |
| Q | 1cm의 1/40을 나타낸다. |
| deg | 보통 1도라고 불리는 단위를 말하며 360deg가 완전한 원을 만든다. |
| grad | 400grad(그라디안)은 완전한 원을 만든다. |
| rad | 2π(라디안)이 완전한 원을 만든다. |
| turn | 1turn(턴)이 완전한 원을 만든다. |
| cap | 대상 요소의 폰트의 대문자 높이를 상대 단위의 기준으로 사용한다. |
| ch | 글꼴 크기에 대한 |
| em | 대상 요소의 폰트 크기를 상대 단위의 기준으로 사용한다. |
| ex | 대상 요소의 폰트의 x-height를 상대 기준으로 사용한다. |
| ic | 한국, 중국, 일본 문자(CJK)의 일반적인 어드밴스 메저(advance measure)를 나타낸다. 상대적인 기준이 되는 값은 표의 문자 '水'의 너비 또는 높이이다. |
| lh | 요소의 |
| rem | html 요소(:root)의 폰트 크기를 상대 기준으로 사용한다. |
| rlh | html 요소(:root)의 |
| Hz | 1초당 발생한 진동수를 나타낸다. |
| kHz | 1000Hz를 나타낸다. |
| vb | html 요소의 블록축 방향으로 뷰포트 길이의 |
| vh | 뷰포트 높이를 상대적으로 |
| vi | html 요소의 인라인 축 방향으로 뷰포트 길이의 |
| vmax | vw 또는 vh 중 큰 값을 나타낸다. |
| vmin | vw 또는 vh 중 작은 값을 나타낸다. |
| vw | 뷰포트 너비를 상대적으로 1% 폭을 갖는다. |
| dpcm | 1cm당 점(dot)의 수를 나타낸다. |
| dpi | 1in당 점(dot)의 수를 나타낸다. |
| dppx | 1픽셀(pixel)당 점(dot)의 수를 나타낸다. |
| ms |
|
| s | 초를 나타낸다. |
| Modules | ||
|---|---|---|
| Module Name | Status | Summary |
| CSS Syntax Module Level 3 | Last review date: 2022-11-27 | |
